/*
 * @message: 描述
 * @Author: Roy
 * @Email: cx_love_xc@163.com
 * @Github: cx_love_xc@163.com
 * @Date: 2022-01-12 16:07:53
 * @LastEditors: Roy
 * @LastEditTime: 2022-01-18 11:44:15
 * @Deprecated: 否
 * @FilePath: /blog/src/admin/container/setting/index.jsx
 */
import React, { useCallback } from 'react';
import { Button, Input } from 'antd';
import request from '../../../common/request';
import { useSelector, useDispatch, } from 'react-redux'
import styles from './style.module.scss'
import { parseJsonByString } from '../../../common/util'
import { getChangePageAttributeAction, getChangeSchemaAction } from '../store/action'



const useStore = () => {
    const dispatch = useDispatch();
    const schema = useSelector((state) => state.common.schema);
    const changeSchema = (schema) => {
        dispatch(getChangeSchemaAction(schema));
    }
    const changePageAttribute = (key, value) => {
        dispatch(getChangePageAttributeAction(key, value));
    }
    return { schema, changePageAttribute, changeSchema }
}


const BasicSetting = () => {
    const { schema = {}, changePageAttribute, changeSchema } = useStore();
    const { attributes = {} } = schema;
    const { title = '' } = attributes;
    //保存
    const handleASaveBtnClick = useCallback(() => {
        request.post('/api/schema/save', {
            schema: JSON.stringify(schema)
        }).then(() => { });
        // localStorage.schema = JSON.stringify(schema)
    }, [schema])
    //重置schema
    const handleAResetBtnClick = useCallback(() => {
        request.get('/api/schema/getLastOne').then((res) => {
            const data = res?.data;
            data && changeSchema(parseJsonByString(data.schema, {}));
        });
        // changeSchema(parseJsonByString(localStorage.schema, {}))
    }, [])

    const handleTitleChange = useCallback((title) => {
        changePageAttribute('title', title)
    }, [])

    return (
        <div>
            <div className={styles.row}>
                <div className={styles.title}>页面标题:</div>
                <div className={styles.content}><Input value={title} onChange={(e) => handleTitleChange(e.target.value)} /></div>
            </div>
            <div className={styles.buttons}>
                <Button type='primary' onClick={handleASaveBtnClick}>保存基本配置</Button>
                <Button type='primary' className={styles.reset} onClick={handleAResetBtnClick}>重置基本配置</Button>
            </div>
        </div>
    )
}


export default BasicSetting;